<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>
</head>

<body>
  <script>
    // 第一题：
    // var fullName = 'language'
    // var obj = {
    //   fullName: 'javascript',
    //   prop: {
    //     getFullName: function () {
    //       return this.fullName
    //     }
    //   }
    // }
    // // undefined  因为它的调用对象是obj里的prop对象，而prop对象里面没有定义fullName，所以是undefined
    // console.log(obj.prop.getFullName());
    // var test = obj.prop.getFullName
    // console.log(test()) // language 调用对象是window

    //No.2
    // var val = 1
    // var json = {
    //   val: 10,
    //   dbl: function () {
    //     val *= 2
    //   }
    // }
    // json.dbl()
    // console.log(json.val + val) //12 = 10 + 2 var声明的是全局变量，dbl函数里的val就是1

    // No.3
    // var val = 1
    // var json = {
    //   val: 10,
    //   dbl: function () {
    //     this.val *= 2
    //   }
    // }
    // json.dbl() // 这里是json对象调用的，this指向的就是json对象，所以此时执行完毕后，val = 20
    // console.log(json.val + val) // 21 = 20 + 1

    // No.4
    // var num = 10;
    // var obj = { num: 20 };
    // // 这里是一个立即执行函数，是由window调用的，所以里面的this指向的是window
    // // 这个函数传了一个参数obj.num
    // obj.fn = (function (num) {
    //   this.num = num * 3;  // 全局变量 window.num = 20 * 3 = 60
    //   num++;  // 传递过来的形参 20++
    //   return function (n) {
    //     this.num += n
    //     num++
    //     console.log(num)
    //   }
    // })(obj.num) // obj.num = 20 传递过去

    // // 相当于 obj.fn = function (n) {
    // //   this.num += n; // 因为 fn(5) 是window调用的，所以this指向的是 window，window.num = 60 + 5
    // //   num++; // 这个 num是上面那个传递过来的形参 因为上面执行了一次 ++ ，这里又执行了一次，所以num是22
    // //   console.log(num);
    // // }

    // var fn = obj.fn
    // fn(5) // 22
    // obj.fn(10) // 23 , 这里同理上面的fn(5),不同的是this指向的是obj，所以
    // console.log(num, obj.num) // 65 30


    // No.5
    // var name = "window";
    // var person1 = {
    //   name: "person1",
    //   show1: function () {
    //     console.log(this.name);
    //   },
    //   show2: () => console.log(this.name),
    //   show3: function () {
    //     return function () {
    //       console.log(this.name);
    //     };
    //   },
    //   show4: function () {
    //     return () => console.log(this.name);
    //   },
    // };

    // var person2 = {
    //   name: "person2",
    // };

    // person1.show1();  // person1
    // person1.show1.call(person2); // person2
    // person1.show2(); // window
    // person1.show2.call(person2); // window  箭头函数不能使用call方法

    // // person1.show3() 执行完之后相当于是函数 function(){console.log(this.name)}，还没执行的函数
    // // 再加多一个()后，变成了立刻执行函数，它调用的对象是window
    // person1.show3()(); // window
    // person1.show3().call(person2); // person2
    // person1.show3.call(person2)(); // window

    // person1.show4()(); // person1 箭头函数遵循的原则是函数定义的上下文，所以这个函数对应的作用域是person1对象
    // person1.show4().call(person2); // person1
    // person1.show4.call(person2)(); // person2
    // // 在person1.show4.call(person2)未执行前改变了它的作用域，最后执行的时候作用域已经被改变了，所以是person2
  </script>
</body>

</html>